
require(['config'], () => {
    require(['jquery', 'artTemplate', 'swiper', 'include'], function ($, template, Swiper) {
        class IndexPage {
            constructor() {
                this.initSwiper()
                this.initSelector()
                this.initproject()
            }
            initSwiper(cityid = '510100') {
                $.ajax({
                    url: '/bilibili/api/ticket/banner/list',
                    method: 'get',
                    data: {
                        district_id: cityid,
                        position: 2,
                        sub_position: 0
                    },
                    dataType: 'json',
                    success: (data) => {
                        // console.log(data.data)
                        const swiperHtml = template('swiper-template', { slides: data.data })
                        const swiperPaginationHtml = template('swiper-pagination-template', { slides: data.data })
                        $('.swiper-wrapper').html(swiperHtml)
                        $('.swiper-pagination-template').html(swiperPaginationHtml)
                        // console.log(swiperHtml)
                        new Swiper('.swiper-container', {
                            loop: true,
                            pagination: {
                                el: '.swiper-pagination',
                                clickable: true
                            }
                        })
                    }
                })
            }

            initSelector(cityid = '510100') {
                //获取城市列表
                $.ajax({
                    url: '/bilibili/api/ticket/city/list',
                    method: 'get',
                    data: {
                        channel: 4
                    },
                    dataType: 'json',
                    success: (data) => {
                        // console.log(data.data.list)
                        const cityListHtml = template('city-list-template', { citylist: data.data.list, active: cityid })
                        $('.city-list').html(cityListHtml)
                    }
                })

                //获取类型列表
                $.ajax({
                    url: '/bilibili/api/ticket/project/listconf',
                    method: 'get',
                    data: {
                        city_id: 510100
                    },
                    dataType: 'json',
                    success: (data) => {
                        // console.log(data.data.tags)
                        const typeListHtml = template('type-list-template', { typelist: data.data.tags })
                        $('.type-list').html(typeListHtml)
                    }
                })

                //获取条件列表
                $.ajax({
                    url: '/bilibili/api/ticket/project/listconf',
                    method: 'get',
                    data: {
                        city_id: 510100
                    },
                    dataType: 'json',
                    success: (data) => {
                        // console.log(data.data.tags)
                        const orderListHtml = template('order-list-template', { orderlist: data.data.filter })
                        $('.order-list').html(orderListHtml)
                    }
                })
            }

            initproject() {
                $.ajax({
                    url: '/bilibili/api/ticket/project/listV2',
                    method: 'get',
                    data: {
                        version:134,
                        page:1,
                        pagesize:15,
                        area:510100,
                        filter:'',
                        platform:'web',
                        p_type:'全部类型'
                    },
                    dataType: 'json',
                    success: (data) => {
                        console.log(data.data)
                        
                        const projectHtml = template('project-list-template', { projectlist: data.data.result })
                        $('.project-list').html(projectHtml)
                        
                        //为每个商品绑定点击事件
                        $('.project-list-item').on('click', function() {
                            let id = $(this).attr('data-id')
                            window.open('/html/detail.html?'+'id='+id)
                        })
                        
                    }
                })
            }
        }

        new IndexPage()


    })
})